<template>
	<view class="step-body">
		<view class="file-content">
			<view class="file-box">
				<view class="file-title">
					<view class="file-title-1">
						<view class="title">论证报告</view>
						<view class="waring">(预算金额>=10万要求上传签字版，预算金额大于100万同时要求再次上传word版本)</view>
					</view>
					<view class="file-title-2" data-key='1' @click="change">
						<text class="number">{{LZList.length}}</text>
						<text class="lg text-black " :class="[key.join(',').indexOf('1')>-1?'cuIcon-fold':'cuIcon-unfold']" style="font-size: 32rpx;"></text>
					</view>
				</view>
				<view class="file-body" v-if="key.join(',').indexOf('1')>-1">
					<view class="file-item" v-for="item in LZList" :key='item.id'>
						<view class="file-item-box">
							<view class="box-image">
								<!-- <image src="../../static/Wicon/word.png" mode=""></image> -->
							</view>
							<view class="box-item-text">
								{{item.fileSourceName}}
							</view>
						</view>
						<view class="box-tsize">
							<text style="margin-right:10rpx;">{{item.fileSize?(item.fileSize/1024).toFixed(2):"--"}}kb</text>
							<text>|</text>
							<text style="margin-left:10rpx;">{{item.createTime}}</text>
						</view>
						<view class="box-item-option">
							<button class="cu-btn round line-blue download-btn" @click="downloadFile(item)">阅览下载</button>
						</view>
								
					</view>
					<view class="file-item file-item-none" v-if="LZList.length==0">
						暂无数据！
					</view>
				</view>
			</view>
			
			
			<view class="file-box">
				<view class="file-title">
					<view class="file-title-1">
						<view class="title">进口设备论证报告</view>
						<view class="waring">(预算金额>=10万且允许进口设备要求上传签字版，预算金额金额大于100万同时要求再次上传word版本)</view>
					</view>
					<view class="file-title-2" data-key='2' @click="change">
						<text class="number">{{JKSBLZList.length}}</text>
						<text class="lg text-black " :class="[key.join(',').indexOf('2')>-1?'cuIcon-fold':'cuIcon-unfold']" style="font-size: 32rpx;"></text>
					</view>
				</view>
				<view class="file-body" v-if="key.join(',').indexOf('2')>-1">
					<view class="file-item" v-for="item in JKSBLZList" :key='item.id'>
						<view class="file-item-box">
							<view class="box-image">
								<!-- <image src="../../static/Wicon/word.png" mode=""></image> -->
							</view>
							<view class="box-item-text">
								{{item.fileSourceName}}
							</view>
						</view>
						<view class="box-tsize">
							<text style="margin-right:10rpx;">{{item.fileSize?(item.fileSize/1024).toFixed(2):"--"}}kb</text>
							<text>|</text>
							<text style="margin-left:10rpx;">{{item.createTime}}</text>
						</view>
						<view class="box-item-option">
							<button class="cu-btn round line-blue download-btn" @click="downloadFile(item)">阅览下载</button>
						</view>
			
					</view>
					<view class="file-item file-item-none" v-if="JKSBLZList.length==0">
						暂无数据！
					</view>
					
				</view>
			</view>
			<view class="file-box">
				<view class="file-title">
					<view class="file-title-1">
						<view class="title">单一来源论证报告</view>
						<view class="waring">(预算金额>=10万且采购方式为单一来源要求上传原件，预算金额金额大于100万同时要求再次上传word版本)</view>
					</view>
					<view class="file-title-2" data-key='3' @click="change">
						<text class="number">{{DYLYList.length}}</text>
						<text class="lg text-black " :class="[key.join(',').indexOf('3')>-1?'cuIcon-fold':'cuIcon-unfold']" style="font-size: 32rpx;"></text>
					</view>
				</view>
				<view class="file-body" v-if="key.join(',').indexOf('3')>-1">
					<view class="file-item" v-for="item in DYLYList" :key='item.id'>
						<view class="file-item-box">
							<view class="box-image">
								<!-- <image src="../../static/Wicon/word.png" mode=""></image> -->
							</view>
							<view class="box-item-text">
								{{item.fileSourceName}}
							</view>
						</view>
						<view class="box-tsize">
							<text style="margin-right:10rpx;">{{item.fileSize?(item.fileSize/1024).toFixed(2):"--"}}kb</text>
							<text>|</text>
							<text style="margin-left:10rpx;">{{item.createTime}}</text>
						</view>
						<view class="box-item-option">
							<button class="cu-btn round line-blue download-btn" @click="downloadFile(item)">阅览下载</button>
						</view>
									
			
					</view>
					<view class="file-item file-item-none" v-if="DYLYList.length==0">
						暂无数据！
					</view>
				</view>
			</view>
			<view class="file-box">
				<view class="file-title">
					<view class="file-title-1">
						<view class="title">其他附件（协议供货、央采等）</view>
						<!-- <view class="waring">(预算金额≥20万)</view> -->
					</view>
					<view class="file-title-2" data-key='4' @click="change">
						<text class="number">{{XYGHList.length}}</text>
						<text class="lg text-black " :class="[key.join(',').indexOf('4')>-1?'cuIcon-fold':'cuIcon-unfold']" style="font-size: 32rpx;"></text>
					</view>
				</view>
				<view class="file-body" v-if="key.join(',').indexOf('4')>-1">
					<view class="file-item" v-for="item in XYGHList" :key='item.id'>
						<view class="file-item-box">
							<view class="box-image">
								<!-- <image src="../../static/Wicon/word.png" mode=""></image> -->
							</view>
							<view class="box-item-text">
								{{item.fileSourceName}}
							</view>
						</view>
						<view class="box-tsize">
							<text style="margin-right:10rpx;">{{item.fileSize?(item.fileSize/1024).toFixed(2):"--"}}kb</text>
							<text>|</text>
							<text style="margin-left:10rpx;">{{item.createTime}}</text>
						</view>
						<view class="box-item-option">
							<button class="cu-btn round line-blue download-btn" @click="downloadFile(item)">阅览下载</button>
						</view>
									
								
					</view>
					<view class="file-item file-item-none" v-if="XYGHList.length==0">
						暂无数据！
					</view>
				</view>
			</view>
			<!-- <view class="file-box">
				<view class="file-title">
					<view class="file-title-1">
						<view class="title">央采填表</view>
					</view>
					<view class="file-title-2" data-key='5' @click="change">
						<text class="number">{{YCTBList.length}}</text>
						<text class="lg text-black " :class="[key.join(',').indexOf('5')>-1?'cuIcon-fold':'cuIcon-unfold']" style="font-size: 32rpx;"></text>
					</view>
				</view>
				<view class="file-body" v-if="key.join(',').indexOf('5')>-1">
					<view class="file-item" v-for="item in YCTBList" :key='item.id'>
						<view class="file-item-box">
							<view class="box-image">
							</view>
							<view class="box-item-text">
								{{item.fileSourceName}}
							</view>
						</view>
						<view class="box-tsize">
							<text style="margin-right:10rpx;">{{item.fileSize?(item.fileSize/1024).toFixed(2):"--"}}kb</text>
							<text>|</text>
							<text style="margin-left:10rpx;">{{item.createTime}}</text>
						</view>
						<view class="box-item-option">
							<button class="cu-btn round line-blue download-btn" @click="downloadFile(item)">阅览下载</button>
						</view>
									
								
					</view>
					<view class="file-item file-item-none" v-if="YCTBList.length==0">
						暂无数据！
					</view>
				</view>
			</view> -->
			<view class="file-box">
				<view class="file-title">
					<view class="file-title-1">
						<view class="title">报价单，不同品牌 </view>
						<!-- <view class="waring">(预算金额>=10万且<=20万)</view> -->
					</view>
					<view class="file-title-2" data-key='6' @click="change">
						<text class="number">{{BJDList.length}}</text>
						<text class="lg text-black " :class="[key.join(',').indexOf('6')>-1?'cuIcon-fold':'cuIcon-unfold']" style="font-size: 32rpx;"></text>
					</view>
				</view>
				<view class="file-body" v-if="key.join(',').indexOf('6')>-1">
				   <view class="file-item" v-for="item in BJDList" :key='item.id'>
				   	<view class="file-item-box">
				   		<view class="box-image">
				   			<!-- <image src="../../static/Wicon/word.png" mode=""></image> -->
				   		</view>
				   		<view class="box-item-text">
				   			{{item.fileSourceName}}
				   		</view>
				   	</view>
				   	<view class="box-tsize">
				   		<text style="margin-right:10rpx;">{{item.fileSize?(item.fileSize/1024).toFixed(2):"--"}}kb</text>
				   		<text>|</text>
				   		<text style="margin-left:10rpx;">{{item.createTime}}</text>
				   	</view>
				   	<view class="box-item-option">
				   		<button class="cu-btn round line-blue download-btn" @click="downloadFile(item)">阅览下载</button>
				   	</view>
				   				
				   			
				   </view>
				   <view class="file-item file-item-none " v-if="BJDList.length==0">
				   	暂无数据！
				   </view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {getFileList} from '../../../api/service.js'
	import ls from '../../../utils/local.js'
	export default{
		props: ['cgId', 'status'],
		data(){
			return {
				key:['1'],
				LZList:[],
				JKSBLZList:[],
				DYLYList:[],
				XYGHList:[],
				YCTBList:[],
				BJDList:[]
				
				
				
			}
		},
		created(){
			this.queryFileList()
		},
		methods:{
			change(e){
			  console.log(e)	
			  var  currentKey=e.currentTarget.dataset.key;
			  var newData=[...this.key];
			   if(this.key.join(',').indexOf(currentKey)>-1){
				   this.key=newData.filter(item=>{
					   return item!=currentKey
				   });
			   }else{
					   this.key.push(currentKey)
				   }
			},
			downloadFile(record){
				       window.open (`${this.download}sys/file/download/${record.id}` , "_blank" ) ;
					   
			},
			queryFileList(){
				uni.showLoading({
				    title: '数据加载中'
				});
				getFileList({cgId:this.cgId}).then(res=>{
					uni.hideLoading()
					if(res.result.length>0){
						this.LZList=res.result.filter(item=>{
							return item.usedType=='LZ_REPORT'
						})
						this.JKSBLZList=res.result.filter(item=>{
							return item.usedType=='JKSBLZ_REPORT'
						})
						this.DYLYList=res.result.filter(item=>{
							return item.usedType=='DYLY_REPORT'
						})
						this.XYGHList=res.result.filter(item=>{
							return item.usedType=='XYGH_APPLY'
						})
						this.YCTBList=res.result.filter(item=>{
							return item.usedType=='YCTB'
						})
						this.BJDList=res.result.filter(item=>{
							return item.usedType=='FILE_USEDTYPE_BJD'
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.file-item-none{
		line-height: 60rpx;
		text-align: center;
	}
	.box-item-option{
		display: flex;
		// align-items: flex-end;
		flex-direction: row;
		justify-content: flex-end;
		text-align: right;
		padding:10rpx 8rpx;
	}
	.download-btn{
		height: 48rpx!important;
		padding: 0 20rpx!important;
		// display: inline-block;
	}
	.file-item {
		display: flex;
		flex-direction: column;
		justify-content: center;
        margin-bottom: 10rpx;
		.file-item-box {

			display: flex;
			flex-direction: row;
			flex: 1;
			justify-content: flex-start;

			// align-items: center;
			.box-image {
				flex: 0;

				image {
					width: 48rpx;
					height: 48rpx;
				}
			}

			.box-item-text {
				flex: 1;
				padding-left: 26rpx;
			}
		}
		.box-tsize{
			padding-left: 74rpx;
			line-height: 36rpx;
			font-size:22rpx;
			font-family:PingFangSC-Regular,PingFang SC;
			font-weight:400;
			color:rgba(153,153,153,1);
			// line-height:32px;
		}
	}

	.file-content {
		background: #f5f5f5;
		display: flex;
		justify-content: center;
		flex-direction: column;

		.file-box {
			flex: 1;
			margin-bottom: 30rpx;
			background: #fff;
			min-height: 124rpx;
			padding: 20rpx 20rpx;
			display: flex;
			flex-direction: column;
			justify-content: center;
			// align-items: center;

			&:first-child {
				margin-top: 20rpx;
			}
		}


	}

	.file-title {
		flex: 1;
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items: center;
		margin-bottom: 20rpx;
		border-bottom: 2rpx solid #F7F4F4;
		padding-bottom: 6rpx;

		.file-title-1 {
			flex: 4;
			text-align: left;

			.title {
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: rgba(51, 51, 51, 1);
				line-height: 42rpx;
			}

			.waring {
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: rgba(250, 85, 60, 1);
				line-height: 34rpx;
			}
		}

		.file-title-2 {
			flex: 1;
			text-align: right;

		}
	}
</style>
